<template>
  <div>
    <!-- 所有上传组件都有这方法
      van-uploader    before-read
      el-upload   before-upload

     -->
    <!-- before-upload:上传前的限制，常用于限制上传文件大小与类型
          on-success：上传成功后解析的excel数据
      -->
    <UploadExcel :before-upload="beforeUpload" :on-success="onSuccess" />
  </div>
</template>
<script>
import UploadExcel from './components/uploadExcel.vue'
export default {
  components: { UploadExcel },
  methods: {
    onSuccess(res) {
      console.log(res)
    },
    beforeUpload(file) {
      // name:文件名  size:文件大小  type:文件类型
      // 限制上传文件大小与类型
      // 上传文件只能小于1m
      // console.log('上传前', file)
      const isExcel = /\.(xlsx|xls|csv)$/.test(file.name)
      if (!isExcel) {
        this.$message.error('请上传xlsx|xls|csv文件')
      }
      const limit1M = file.size / 1024 / 1024 < 1
      if (!limit1M) {
        this.$message.error('请上传1mb以内的文件')
      }

      return limit1M && isExcel
    }
  }

}
</script>
<style>
</style>
